<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>用户审批信息列表</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1.0" />
    <#include "/view/head.html"/>
    <style type="text/css">
        .table-class{
            width:90%;
            text-align: center;
            border:1px solid #afd9ee;
            margin:0 auto;
            margin-top: 50px;
        }
        .list-path{
            height: 50px;
            line-height: 50px;
            background-color: #9acfea;

        }
        table th{
            text-align: center;
        }
        table thead tr {
            background-color: #9acfea;
        }
        .table-query{
            /*height: 40px;*/
            /*width:80px;*/
            /*text-align: center;*/
            white-space:nowrap;

        }
    </style>
    <script type="text/javascript">
        function query(dm){
            var val = $('#q').val();
            var sel = $('#approveStatus').val();
            location.href='${base}/approve/list.do?q='+val+'&approveStatus='+sel;
        }
    </script>
</head>
<body>


<div class="list-path" > <span style="margin-left: 50px;"><span class="glyphicon glyphicon-home"></span> 用户审批信息列表</span></div>

<div class="table-class">
    <!--<div class="table-query">-->
    <#if msg??>
        <div class="alert alert-error"
             style="background-color: #f2dede; color: #a94442;">
            <a class="close" data-dismiss="alert">×</a> <strong>错误!</strong>${msg!}
        </div>
    </#if>

        <div class="input-group table-query" style="margin-top:25px;margin-left: 50px;">
            <input type="text" class="form-control" id="q" name="q" value="${q!}" placeholder="姓名/别名/手机号" style="width: 200px;" >
              <select id="approveStatus" name="approveStatus" class="form-control" style="width: 150px;">
                <option value="">请选择...</option>
                <option value="0" <#if approveStatus??&&'0' == approveStatus>selected="selected"</#if>>审批中</option>
                <option value="1" <#if approveStatus??&&'1' == approveStatus>selected="selected"</#if>>审批通过</option>
                <option value="2" <#if approveStatus??&&'2' == approveStatus>selected="selected"</#if>>审批不通过</option>
            </select>
            <a class="btn btn-info" href="javascript:query(this)"><span class="glyphicon glyphicon-search"></span> 查找</a>

        </div>
      <hr/>
     
    <table class="table table-hover">
        <thead>
        <tr>
            <th>序号</th>
            <th>票数</th>
            <th>创建时间</th>
            <th>姓名</th>
            <th>别名</th>
            <th>手机号</th>
            <th>代言人</th>
            <th>审批状态</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <#list pagination.list as c>
            <tr>
                <td>${(pagination.pageNo-1)*pagination.pageSize+1+c_index}</td>
                <td>${c.count!}</td>
                <td><#if (c.createtime)?? >${c.createtime?string('yyyy-MM-dd HH:mm')}</#if></td>
                <td>${c.fullName!}</td>
                <td>${c.nick!}</td>
                <td>${c.telephone!}</td>
                <td>
                    <#if c.represent??>
                        <#if 1==c.represent>红色出行代言人</#if>
                        <#if 2==c.represent>绿色出行代言人</#if>
                        <#if 3==c.represent>橙色出行代言人</#if>
                    </#if>
                </td>
                <td>

                    <#if c.approveStatus??>
                        <#if 0==c.approveStatus><span class="label label-default">待审批中</span></#if>
                        <#if 1==c.approveStatus><span class="label label-success">审批通过</span></#if>
                        <#if 2==c.approveStatus><span class="label label-danger">审批不通过</span></#if>
                    </#if>
                </td>

                <td>
                    <#--<a href="${base}/approve/detail.do?id=${c.userinfoId}">详情</a>-->
                    <input type="hidden" id="key${c_index}" class="userinfoId" value="${c.userinfoId!}"/>
                    <input type="hidden" class="ticket" value="${c.count!}"/>
                    <a href="${base}/approve/record.do?id=${c.userinfoId}" >审批信息</a>
                    |
                    <!--<a id="temp2" tabindex="0" class="btn btn-info" role="button" data-toggle="popover">修改票数</a>-->
                    <a href="#" class="ppov" data-toggle="popover">修改票数</a>
                </td>
            </tr>


        </#list>
        <#if 0==pagination.totalCount>
            <tr>
                <td colspan="7" style="color: red"> 没有相关数据 </td>
            </tr>
        </#if>




        </tbody>
    </table>
    <ul class="pagination">
        <#if pagination??>
            <#if pagination.pageNo gt 1>
                <li><a href="${base}/approve/list.do?pageNo=1">首页</a></li>
            </#if>
            <#list 5..1 as t>
                <#if (pagination.pageNo-t gt 0)>
                    <li><a href="${base}/approve/list.do?pageNo=#{pagination.pageNo-t}">#{pagination.pageNo-t}</a></li>
                </#if>
            </#list>
            <li><a href="#" style="background-color: #ddd;">#{pagination.pageNo}</a></li>
            <#list 1..5 as t>
                <#if (pagination.totalPage gt pagination.pageNo+t-1)>
                    <li><a href="${base}/approve/list.do?pageNo=#{pagination.pageNo+t}">#{pagination.pageNo+t}</a></li>
                </#if>
            </#list>
            <#if pagination.totalPage gt pagination.pageNo>
                <li><a href="${base}/approve/list.do?pageNo=#{pagination.totalPage}">尾页</a></li>
            </#if>

      <!--  <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>
        <li><a href="#">5</a></li>-->



        </#if>

    </ul>
</div>
<script>
    $(function () {
        $('[data-toggle="popover"]').each(function () {
            var element = $(this);
            var id = element.attr('id');
            var count = '0';
            var key = $(this).parent().find('input[class=userinfoId]').attr('id');
            var userinfoId=$(this).parent().find('input[class=userinfoId]').val();
            var ticket=$(this).parent().find('input[class=ticket]').val();
            element.popover({
                trigger: 'manual',
                placement: 'bottom', //top, bottom, left or right
                title: '修改票数',

                html: 'true',
                content: ContentMethod(key,userinfoId,ticket),
            }).on("click", function () {
                var _this = this;
                $(this).popover("show");
               /* $(this).siblings(".popover").on("mouseleave", function () {
                    $(_this).popover('hide');
                });*/
            })/*.on("mouseleave", function () {

                var _this = this;
                setTimeout(function () {
                    if (!$(".popover:hover").length) {
                        $(_this).popover("hide")
                    }
                }, 100);
            })*/;
        });
    });
    function ContentMethod(key,userinfoId,ticket) {
        return '<form action="${base}/vote/savevotenum.do" method="POST" onsubmit="checkFormVotenum(this)"><table class="table table-bordered"><tr><td><input type="hidden"  name="id" value="'+userinfoId+'"/><input type="text" placeholder="票数" name="voteNum" value="'+ticket+'"/> </td></tr><tr><td><button type="submit" class="btn btn-success" >修改</button>&nbsp;&nbsp;<button type="button" class="btn btn-danger" onclick="closePPv('+key+')">取消</button> </td></tr></table></form>';
    }
    function checkFormVotenum(d){
        var voteNum = $(d).find('input[name="voteNum"]').val();
        voteNum = voteNum.replace(/[^\d]/g,"");
       /* if(''==voteNum){
            return false;
        }
        var reg = new RegExp("^[0-9]*$");
        if(!reg.test(voteNum)){
            alert("请输入数字!");
            return false;
        }*/
        $(d).find('input[name="voteNum"]').val(voteNum);
        return true;

    }
    function closePPv(key){
        $(key).siblings('a[class=ppov]').popover('hide');
    }


	function sendPhone(){
		
	}


</script>

</body>
</html>
